<%@ page language="java" import="java.util.*" pageEncoding="UTF-8" isELIgnored="false" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<html>
<head>
<title>电子书城</title>
<link rel="stylesheet" href="${pageContext.request.contextPath}/client/css/main.css" type="text/css" />
	<script type="application/javascript" src="/client/jquery/jquery-2.2.4.min.js"></script>
<script>
    //当商品数量发生变化时触发该方法
	function changeProductNum(type,total,pid,e) {

		var stockBox = $(e).parent().next();
		var subTotalBox = stockBox.next();
		var price = parseFloat(stockBox.prev().prev().html());
		var showTotal = $("#showTotal")
		var totalPrice = parseFloat(showTotal.html());

		var count = 0;
		var stockTotal = parseFloat(stockBox.html());

		if (type == 0){
			var numberBox = $(e).next("input");
			count = parseFloat(numberBox.val());
		if (count <= 1){
			alert("已经极限了，不能再少了!");
			return;
		}
		count = count - 1;
		totalPrice=totalPrice-price;
		}

		if (type == 1){
			var numberBox = $(e).prev("input");
			count = parseFloat(numberBox.val());
			if (count >= total){
				alert("已经极限了，不能再多了!");
				return;
			}
			count = count + 1;
			totalPrice=totalPrice+price;
		}

		$.ajax({
			url: "/cart/updateQuantity.do",
			type: "POST",
			contentType:"application/json",
			data: JSON.stringify({pid:pid,quantity:count}),
			dataType: "json",
			error: function (data) {
			},
			success: function (data) {
				// alert(data.message);
				if (data.status == 0){
					numberBox.val(count);
					stockBox.html(total-count);
					subTotalBox.html((price*count).toFixed(1));
					showTotal.html(totalPrice.toFixed(1));
				}
			}
		})
	}
	//删除购物车中的商品
	function cart_del() {
	    var msg = "您确定要删除该商品吗？";
	    if (confirm(msg)==true){
	    return true;
	    }else{
	    return false;
	    }
	}
</script>
</head>
<body class="main">
	<jsp:include page="head.jsp" />
	<jsp:include page="menu_search.jsp" />
	<div id="divpagecontent">
		<table width="100%" border="0" cellspacing="0">
			<tr>
				<td>
					<div style="text-align:right; margin:5px 10px 5px 0px">
						<a href="${pageContext.request.contextPath }/main/index.do">首页</a>
						&nbsp;&nbsp;&nbsp;&nbsp;&gt;&nbsp;&nbsp;&nbsp;&nbsp;购物车
					</div>
					<table cellspacing="0" class="infocontent">
						<tr>
							<td>
								<img src="${pageContext.request.contextPath}/client/ad/page_ad.jpg" width="900" height="89" />
								<table width="100%" border="0" cellspacing="0">
									<tr>
										<td>
											<img src="${pageContext.request.contextPath}/client/images/buy1.gif" width="635" height="38" />
										</td>
									</tr>
									<tr>
										<td>
											<table cellspacing="1" class="carttable">
												<tr>
													<td width="10%">序号</td>
													<td width="30%">商品名称</td>
													<td width="10%">价格</td>
													<td width="20%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;数量</td>
													<td width="10%">库存</td>
													<td width="10%">小计</td>
													<td width="10%">取消</td>
												</tr>
											</table>
											<!-- 循环输出商品信息 -->

											<c:set var="total" value="0" />
											<c:forEach items="${clist}" var="entry" varStatus="vs">
												<table width="100%" border="0" cellspacing="0">
													<tr>
														<td width="10%">${vs.count}</td>
														<td width="30%">${entry.product.name }</td>
														<td width="10%">${entry.product.price }</td>
														<td width="20%">
														    <!-- 减少商品数量 -->
															<input type="button" value='-' style="width:20px"
															       onclick="changeProductNum(0,${entry.product.pnum},'${entry.product.id}',this)">
															 <!-- 商品数量显示 -->
															<input name="text" type="text" value="${entry.quantity}" style="width:40px;text-align:center" />
															<!-- 增加商品数量 -->
															<input type="button" value='+' style="width:20px"
															       onclick="changeProductNum(1,${entry.product.pnum},'${entry.product.id}',this)">
														</td>
														<td width="10%">${entry.product.pnum-entry.quantity}</td>
														<td width="10%">${entry.subTotal}</td>
														<td width="10%">
														    <!-- 删除商品 -->
															<a href="${pageContext.request.contextPath}/cart/deleteById.do?pid=${entry.product.id}"
															style="color:#FF0000; font-weight:bold" onclick="javascript:return cart_del()">X</a>
														</td>
													</tr>
												</table>
												<c:set value="${total+entry.subTotal}" var="total" />
											</c:forEach>

											<table cellspacing="1" class="carttable">
												<tr>
													<td style="text-align:right; padding-right:40px;">
														<font style="color:#FF6600; font-weight:bold">合计：&nbsp;&nbsp;<span id="showTotal">${total}元</font>
													</td>
												</tr>
											</table>
											<div style="text-align:right; margin-top:10px">
											    <!--继续购物 -->
												<a href="${pageContext.request.contextPath}/main/searchProduct.do">
													<img src="images/gwc_jx.gif" border="0" />
												</a>
												&nbsp;&nbsp;&nbsp;&nbsp;
                                                 <!--结账 -->
												<a href="${pageContext.request.contextPath}/cart/order.do">
													<img src="${pageContext.request.contextPath}/client/images/gwc_buy.gif" border="0" />
												</a>
											</div>
										</td>
									</tr>
								</table>
							</td>
						</tr>
					</table>
				</td>
			</tr>
		</table>
	</div>
	<jsp:include page="foot.jsp" />
</body>
</html>
